<template>
	  <div class="pop">  
	       <div class="head-line between"> 
				<span class="head">结算方式</span>
				<span @click="$emit('submit')">取消</span>
		   </div>  
		   <div class="list"> 
			   <div :class="item == cur1?'item cur-item':'item'" v-for="(item,index) in list1" :key="`hot1${index}`"  @click="choose1(item)">
				{{item}}
			   </div>
		   </div>   
		   <div class="head">员工福利</div> 
		   <div class="list"> 
		   			   <div :class="item == cur2?'item cur-item':'item'" v-for="(item,index) in list2" :key="`hot2${index}`"  @click="choose2(item)">
		   				{{item}}
		   			   </div>
		   </div> 
		   <div class="head">性别要求</div>
		   <div class="list"> 
		   			   <div :class="item == cur3?'item cur-item':'item'" v-for="(item,index) in list3" :key="`hot3${index}`"  @click="choose3(item)">
		   				{{item}}
		   			   </div>
		   </div> 
		   <div class="head">上班时段</div>
		   <div class="list"> 
		   			   <div :class="item == cur4?'item cur-item':'item'" v-for="(item,index) in list4" :key="`hot4${index}`"  @click="choose4(item)">
		   				{{item}}
		   			   </div>
		   </div> 
		   <div class="btns">
		   			  <van-button type="primary" class="btn" color="#c3c3c3" @click="clear">重置</van-button>
					  <van-button type="primary" class="btn"  color="#339966" @click="submit">确定</van-button>
		   </div> 
	  </div>   
</template>
<style scoped> 
 .pop{padding:10px 15px 20px 15px;}
 .head{ font-size:20px;font-weight:600;margin:10px 0} 
 .head-line{ margin:0 0 10px 0}
 .item{display: inline-block;margin:5px;background: #f2f2f2;
 padding:5px 10px;border-radius: 8px; color:#222222;box-shadow: 5px 5px 5px rgba(0,0,0,0.5);}
 .cur-item{ background: #339966;color:#FFF} 
 .btn{ border-radius: 8px; width:30vw;margin:10px}
 .btn{  text-align: end }
</style>
<script>


export default { 
 props: {
   show: Boolean
 },
  data() {
    return { 
	  cur1:'不限',list1:"不限,日结,周结,月结,完工结".split(","),
	  cur2:'不限',list2:"不限,服装福利,住房福利,交通福利,节日福利,生日福利,健康体检,通讯补贴,及时激励,餐饮福利".split(","),
	  cur3:'不限',list3:"不限,男生可做,女生可做".split(","),
	  cur4:'不限',list4:"不限,上午,下午,晚上,凌晨".split(","),
	  pop:this.show,
    }
  },  
  methods: {
  	 choose1(val){  this.cur1 = val;  }, 
	 choose2(val){  this.cur2 = val;  }, 
	 choose3(val){  this.cur3 = val;  },
	 choose4(val){  this.cur4 = val;  }, 
	 clear(){  this.cur1 =  this.cur2 =  this.cur3 =  this.cur4 = "不限";  }, 
	 submit(){  
		 this.$emit('submit',{
			 jz:this.cur1,
		     fl:this.cur2,
		     xb:this.cur3,
			 time:this.cur4,
		 })
	 }, 
  },
}
</script>
